<template>
  <div>
    <v-tableTitle :btnConfig="btnConfig" :tableSelectData="tableSelectData" title="Edi接口" @del="del" @newCreate="newCreate" 
    @configtable="configtable" @configCustomProcess ="configCustomProcess" @ediapitest="ediapitest" @previewAPI="previewAPI" @refreshCaceh="refreshCaceh"></v-tableTitle>

    <GTable ref="table" :hasCheck="true" :hasEdit="true" :api="apiMap.getListApi" :columnSource="baseColumns" :cbFun="cbFun" @selection-change="data => tableSelectData = data"
            @setdialog="setdialog" />

    <el-dialog :title="dialogModule.title" :visible.sync="dialogModule.flag" center v-dialogDrag width="720px" @closed="closed">
      <div v-tit="'Edi接口创建'">
        <GForm ref="detail" :config="formConfig" :rules="formRules" labelWidth="120px" v-model="form"></GForm>
      </div>
      <span slot="footer">
        <el-button type="primary" @click="handleConfirm">确定</el-button>
        <el-button @click="dialogModule.flag = false">取消</el-button>
      </span>
    </el-dialog>


   <el-dialog title="配置自定义逻辑" :visible.sync="dialogTableVisible" width="720px">
      <div v-tit="'配置自定义逻辑'">
        <el-transfer 
        v-model="validate" 
        :data="allVALIDATE"
        :titles="['校验自定义逻辑', '生效逻辑']"
        :props="{
          key: 'id',
          label: 'name'
        }"
        ></el-transfer>

        <el-transfer 
        v-model="prehandel" 
        :data="allPREHANDLE"
        :titles="['插入前自定义逻辑', '生效逻辑']"
        :props="{
          key: 'id',
          label: 'name'
        }"        
        ></el-transfer>

        <el-transfer 
        v-model="customafter" 
        :data="allCUSTOMAFTER"
        :titles="['插入后自定义逻辑', '生效逻辑']"
        :props="{
          key: 'id',
          label: 'name'
        }"
        ></el-transfer>
      </div>
    <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTableVisible = false">取 消</el-button>
    <el-button type="primary" @click="configApiProcess">保存</el-button>
  </div>
  </el-dialog>

   <el-dialog title="edi接口测试" :visible.sync="dialogTestAPIVisible" width="720px"> 
      <el-form ref="apitestformRef"  :model="apitestform">
    <el-form-item label="请求报文示例" :label-width="formLabelWidth">
      <el-input prop="apitestform.request" v-model="apitestform.request" type ="textarea" ></el-input>
    </el-form-item>
    <el-form-item label="响应信息" :label-width="formLabelWidth">
      <el-input prop="apitestform.response" v-model="apitestform.response" type ="textarea" ></el-input>
    </el-form-item>
  </el-form>
    <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTestAPIVisible = false">取 消</el-button>
    <el-button type="primary" @click="sendTestRequest">请求</el-button>
  </div>
  </el-dialog>

  <el-dialog title="预览接口调用信息" :visible.sync="previewAPIDialog" width="720px" > 
    <el-descriptions title="请求URL" :column="1" border>
    <el-descriptions-item label="接口URL">http://127.0.0.1:8982/ris-edi/test/gatway/std/test?method={{configcode}}</el-descriptions-item>
    </el-descriptions>

  </el-dialog>

  </div>
</template>

<script>
import tableTitle from 'commons/TableTitle'

export default {
  name: 'ediapi',
  data() {
    return {
      requestdata:'',
      configcode:'',
      previewAPIDialog:false,
      dialogTableVisible:false,
      dialogTestAPIVisible:false,
      currentid:'',
      tableSelectData: [],
      gridData:[],
      dialogModule: {
        loading: false,
        flag: false,
        title: '',
        data: null,
        type: ''
      },
      form: {
        id: null,
        name: '',
        code: '',
        type: '',
        request:''
      },
      options: {
        datasources: [],
        whseidRuel:[],
        updRule:[],
        serialrule:[]
      },
      customafter:[],
      validate:[],
      prehandel:[],
      allVALIDATE:[],
      allPREHANDLE:[],
      allCUSTOMAFTER:[],
      apitestform:{
        request:'',
        response:''
      },
      formLabelWidth: '120px',
    }
  },
  computed: {
    btnConfig() {
      return [
        {
          label: this.$t('common.create'),
          invalid: 'newCreate'
        },
        {
          label: this.$t('common.delete'),
          disabled: true,
          invalid: 'del'
        },
        {
          label: '配置表',
          disabled: true,
          invalid: 'configtable'
        },
        {
          label: '配置自定义逻辑',
          disabled: true,
          invalid: 'configCustomProcess'
        },
        {
          label: '测试EDIAPI',
          disabled: true,
          invalid: 'ediapitest'
        },
        {
          label: '预览API',
          disabled: true,
          invalid: 'previewAPI'
        },
        {
          label: '刷新缓存配置',
          disabled: true,
          invalid: 'refreshCaceh'
        }
      ]
    },
    baseColumns() {
      return [
        {
          label: '接口名称',
          prop: 'name',
          input: 'input'
        },
        {
          label: '接口编码',
          prop: 'code',
          input: 'input'
        },
        {
          label: '报文类型',
          prop: 'type',
          input: 'select',
          options: [
          { label: '标准', value: 'STD' },
          { label: '自定义', value: 'UDF' }
          ]
        },
        {
          label: '数据源',
          prop: 'datasource',
          input: 'select',
          options:this.options.datasources
        },
        // {
        //   label: '主表',
        //   prop: 'maintable',
        //   input: 'input'
        // },
        // {
        //   label: '从表列表',
        //   prop: 'subtable',
        //   input: 'input'
        // },
        {
          label: '请求报文',
          prop: 'request',
          input: 'input'
        },
         {
          label: '结果集中目标值',
          prop: 'targetfield',
          input: 'input'
        },
        {
          label: '仓库号确定规则',
          prop: 'whseidruleid',
          input: 'select',
          options: this.options.whseidRuel
        },
        {
          label: '更新规则',
          prop: 'updruleid',
          input: 'select',
          options: this.options.updRule
        }
        // ,
        // {
        //   label: '自定义逻辑',
        //   prop: 'whseidruleid',
        //   input: 'select',
        //   options: [
        //   { label: '标准仓库确定策略', value: 'STD' }
        //   ]
        // }
      ]
    },
    formConfig() {
      return [
        {
          label: '接口名称',
          prop: 'name',
          type: 'input'
        },
        {
          label: '接口编码',
          prop: 'code',
          type: 'input'
        },
        {
          label: '报文类型',
          prop: 'type',
          type: 'select',
          options: [
          { label: '标准', value: 'STD' },
          { label: '自定义', value: 'UDF' }
          ]
        },
        {
          label: '数据源',
          prop: 'datasource',
          type: 'select',
          options:this.options.datasources
        }, 
        // {
        //   label: '主表名称',
        //   prop: 'maintable',
        //   type: 'input',
        // }, 
        // {
        //   label: '从表',
        //   prop: 'subtable',
        //   type: 'input'
        // }, 
        {
          label: '请求报文',
          prop: 'request',
          type: 'input'
        },
        {
          label: '仓库号确定规则',
          prop: 'whseidruleid',
          type: 'select',
          options:this.options.whseidRuel
        },
        {
          label: '更新策略 ',
          prop: 'updruleid',
          type: 'select',
          options: this.options.updRule
        },
        {
          label: '流水号规则 ',
          prop: 'serialruleid',
          type: 'select',
          options: this.options.serialrule
        }
        // ,
        // {
        //   label: '自定义逻辑',
        //   prop: 'customids',
        //   type: 'select',
        //   options: [
        //   { label: '自定义逻辑', value: '1' }
        //   ]
        // }
      ]
    },
    formRules() {
      return {

      }
    },
    apiMap() {
      return {
        getListApi: '/v1/ediApi/selectEdiApiPageList',
        getInfoApi:'/v1/ediApi/selectEdiApiById',
        editApi:'/v1/ediApi/editEdiApi',
        deleteApi: '/v1/ediApi/deleteEdiApiIds',
        addApi: '/v1/ediApi/addEdiApi',
        sendTestRequest:'/v1/ediApi/apitest'
      }
    }
  },
  methods: {
    refreshCaceh(data){
      if(data.length != 1){
        return this.$message.error("请选择一条数据进行操作");
      }

      this.$post('/v1/ediApi/refreshCaceh', data[0]).then(res => {
         this.$message.success(res.returnMgr)
      })
    },
    previewAPI(data){
      if(data.length != 1){
        return this.$message.error("请选择一条数据进行操作");
      }
      this.previewAPIDialog=true;
      this.configcode = data[0].code;
      this.requestdata = data[0].request;
    },
    sendTestRequest(){
      this.$post(this.apiMap.sendTestRequest, {
        id:this.currentid,
        request:this.apitestform.request
      }).then(res => {
        this.apitestform.response=res.data.testapirespose;
      })
    },
    ediapitest(data){
      if(data.length != 1){
        return this.$message.error("请选择一条数据进行操作");
      }
      this.dialogTestAPIVisible =true;
      this.apitestform.request = data[0].request;
      this.currentid = data[0].id;
    },
    configCustomProcess(data){
      if(data.length != 1){
        return this.$message.error("请选择一条数据进行操作");
      }
      this.dialogTableVisible = true;
      this.currentid = data[0].id;
      this.$post('/v1/ediApi/queryConfigEdiCustomProcess',{ id: data[0].id}).then(res => {
        this.allVALIDATE = res.data.item.allVALIDATE;
        this.allPREHANDLE=res.data.item.allPREHANDLE;
        this.allCUSTOMAFTER=res.data.item.allCUSTOMAFTER;
        this.validate = res.data.item.validate;
        this.prehandel = res.data.item.prehandel;
        this.customafter = res.data.item.customafter;
      })
    },
    configApiProcess(){
        let configEdiCustomProcessRequest = {
          id: this.currentid,
          VALIDATE:this.validate,
          PREHANDLE:this.prehandel,
          CUSTOMAFTER:this.customafter
        }
        this.$post('/v1/ediApi/configEdiCustomProcess',configEdiCustomProcessRequest).then(res => {
        this.$message.success(res.msg)
      })
      this.dialogTableVisible = false;
    },
    configtable(data){
      if(data.length != 1){
        return this.$message.error("请选择一条数据进行操作")
      }
      this.$router.push({ path: '/app/ediapi/tableConfig', query: { id: data[0].id } })
    },
    handleConfirm() {
      this.$refs.detail.validate().then(valid => {
        const params = this._.cloneDeep(this.form)

        let promise
        if (this.dialogModule.type == 'edit') {
          promise = this.$post(this.apiMap.editApi, params)
        } else {
          promise = this.$post(this.apiMap.addApi, params)
        }
        promise.then(res => {
          this.$message.success(res.returnMgr)
          this.getTableData()
          this.$refs.detail?.resetFields()
          this.dialogModule.flag = false
        })
      })

    },
    getInfoById(id) {
      this.$post(this.apiMap.getInfoApi, {
        id
      }).then(res => {
        this.form = res.data.item
        this.dialogModule.flag = true
      })
    },
    setdialog(data) {
      this.dialogModule.title = `编辑[${data.name}]Edi接口`
      this.dialogModule.type = 'edit'
      this.dialogModule.data = data
      this.getInfoById(data.id)
    },
    newCreate() {
      this.dialogModule.title = '新增EDI接口'
      this.dialogModule.type = 'add'
      this.dialogModule.data = null
      this.dialogModule.flag = true
    },
    //删除
    async del(data) {
      this.$post(this.apiMap.deleteApi, data).then(res => {
        this.$message.success(res.returnMgr)
        this.getTableData()
      })
    },
    getOptions() {
      this.$post('/v1/ediApi/queryActiveWhseid',{}).then(res => {
        this.options.datasources = res.data.item;
      });
      this.$post('/v1/ediApi/queryWhseidRuel',{}).then(res => {
        this.options.whseidRuel = res.data.item;
      })
      this.$post('/v1/ediApi/queryUpdRule',{}).then(res => {
        this.options.updRule = res.data.item;
      })
      this.$post('/v1/ediApi/queryserialrule',{}).then(res => {
        this.options.serialrule = res.data.item;
      })
    },

    closed() {
      this.$refs.detail?.resetFields()
    },
    cbFun(res) {
      return { list: res.data.page.records, total: res.data.page.total }
    },
    async getTableData() {
      this.$refs.table.getTableData()
    }
  },
  mounted() {
    this.getOptions();
  },
  components: {
    'v-tableTitle': tableTitle
  }
}
</script>

<style scoped>
</style>
